<template>
	<view class="animated fadeIn faster">
		<view class="status-bar-height"></view>
		<view class="mine mb-5">
			<view class="pt-6 pb-7 d-flex d-flex-middle">
				<image class="rounded" src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/store/store4.png" mode="aspectFill" style="width: 120rpx;height: 120rpx;"></image>
				<view class="ml-2">
					<text class="font32 font-500" style="color: #2E2E2E;" @click="logout">13657256730</text>
				</view>
			</view>
			<view class="px-1-5 d-flex d-flex-between">
				<view class="d-flex d-flex-column d-flex-center d-flex-middle">
					<image class="mb-1" src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/business.png" style="width: 48rpx;height: 48rpx;"></image>
					<text class="color222">商务信息</text>
				</view>
				<view class="d-flex d-flex-column d-flex-center d-flex-middle">
					<image class="mb-1" src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/service.png" style="width: 48rpx;height: 48rpx;"></image>
					<text class="color222">为你服务</text>
				</view>
				<view class="d-flex d-flex-column d-flex-center d-flex-middle">
					<image class="mb-1" src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/vip.png" style="width: 48rpx;height: 48rpx;"></image>
					<text class="color222">交付会费</text>
				</view>
				<view class="d-flex d-flex-column d-flex-center d-flex-middle">
					<image class="mb-1" src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/invite.png" style="width: 48rpx;height: 48rpx;"></image>
					<text class="color222">邀请商友</text>
				</view>
			</view>
		</view>
		
		<view class="px-3">
			<view class="e-money-bg">
				<view class="d-flex d-flex-middle d-flex-between mb-4">
					<view class="d-flex d-flex-middle">
						<text class="iconfont icon-yongjin mr font32"></text>
						<text class="font30">我的佣金(元)</text>
					</view>
					<text class="icon-youjiantou iconfont" style="color: #b2b2b2;"></text>
				</view>
				<view class="d-flex">
					<view class="d-flex d-flex-column d-flex-middle d-flex-center d-flex-item">
						<text class="font40 font-bold mb-1">5546</text>
						<text class="font24 color222">业绩佣金</text>
					</view>
					<view class="d-flex d-flex-column d-flex-middle d-flex-item">
						<view class="mb-1 position-relative">
							<text class="font40 font-bold">0</text>
							<view class="e-bage position-absolute top-0" style="height: 32rpx;width: 66rpx;line-height: 32rpx;text-align: center;left:33rpx"><text class="colorfff" style="font-size: 18rpx;">去开通</text></view>
						</view>
						<text class="font24 color222">业绩佣金</text>
					</view>
					<view class="d-flex d-flex-column d-flex-middle d-flex-item">
						<view class="mb-1 position-relative">
							<text class="font40 font-bold">0</text>
							<view class="e-bage position-absolute top-0" style="height: 32rpx;width: 66rpx;line-height: 32rpx;text-align: center;left:33rpx"><text class="colorfff" style="font-size: 18rpx;">去开通</text></view>
						</view>
						<text class="font24 color222">运营佣金</text>
					</view>
				</view>
			</view>
			<view class="pt-1 pb-4">
				<text class="font32 color000 font-600">其他功能</text>
			</view>
			<view class="func p-3 mb-2">
				<view class="d-flex d-flex-between d-flex-middle mb-4">
					<view class="d-flex d-flex-middle">
						<image src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/func-user.png" class="mr-2" style="width: 36rpx;height: 36rpx;"></image>
						<text class="color222">实名认证</text>
					</view>
					<view class="d-flex d-flex-middle">
						<text class="main-color mr">未认证</text>
						<text class="iconfont icon-youjiantou colorbbb"></text>
					</view>
				</view>
				<view class="d-flex d-flex-between d-flex-middle mb-4">
					<view class="d-flex d-flex-middle">
						<image src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/func-record.png" class="mr-2" style="width: 36rpx;height: 36rpx;"></image>
						<text class="color222">付费记录</text>
					</view>
					<text class="iconfont icon-youjiantou colorbbb"></text>
				</view>
				
				<view class="d-flex d-flex-between d-flex-middle">
					<view class="d-flex d-flex-middle">
						<image src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/func-phone.png" class="mr-2" style="width: 36rpx;height: 40rpx;"></image>
						<text class="color222">修改手机</text>
					</view>
					<text class="iconfont icon-youjiantou colorbbb"></text>
				</view>
			</view>
			
			<view class="func p-3 mb-5">
				<view class="d-flex d-flex-between d-flex-middle mb-4">
					<view class="d-flex d-flex-middle">
						<image src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/func-msg.png" class="mr-2" style="width: 40rpx;height: 40rpx;"></image>
						<text class="color222">信息免扰</text>
					</view>
					<switch :checked="closeInfo" style="transform: scale(.7);" color="#FF5816" @change="closeInfo = $event.detail.value? true:false"/>
				</view>
				
				<view class="d-flex d-flex-between d-flex-middle">
					<view class="d-flex d-flex-middle">
						<image src="https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/func-out.png" class="mr-2" style="width: 40rpx;height: 40rpx;"></image>
						<text class="color222">暂退商友</text>
					</view>
					<switch :checked="closeBus" style="transform: scale(.7);" color="#FF5816" @change="closeBus = $event.detail.value? true:false"/>
				</view>
			</view>
			<view class="d-flex d-flex-center d-flex-middle py-2">
				<text class="color225 font26">我要咨询</text>
				<text class="color225 iconfont icon-shugang mx-2"></text>
				<text class="color225 font26" @click="logout">退出系统</text>
			</view>
		</view>
	</view>
</template>

<script>
	const uniIdCo = uniCloud.importObject("uni-id-co")
	export default {
		data() {
			return {
				closeInfo:true,
				closeBus:false,
				userinfo:{
					_id:'',
					nickname:'游客',
					avatar_file:{
						url:'https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/avatar/avatarUrl.png'
					}
				}
			}
		},
		onReady() {
			let userinfo = uni.getStorageSync('uni-id-pages-userInfo')
			if(userinfo){
				this.userinfo = userinfo
			}
		},
		methods: {
			clearCache(){
				uni.showToast({
					title:'缓存清除成功！',
					icon:'none'
				})
			},
			async logout(){
				if(uniCloud.getCurrentUserInfo().tokenExpired > Date.now()){
					try{
						await uniIdCo.logout()
					}catch(e){
						console.error(e);
					}
				}
				uni.removeStorageSync('uni_id_token');
				uni.removeStorageSync('uni-id-pages-userInfo')
				uni.setStorageSync('uni_id_token_expired', 0)
				uni.redirectTo({
					url: '/pages/login/login',
				});
			}
		}
	}
</script>

<style scoped>
.mine{
	padding-left: 35rpx;
	padding-right: 35rpx;
}
.e-money-bg{
	background: url('https://env-00jxtf9stgc0.normal.cloudstatic.cn/images/e-money-bg.png?v=45461') no-repeat;
	padding-top: 28rpx;
	padding-left: 30rpx;
	padding-right: 30rpx;
	width: 630rpx;
	height: 220rpx;
	background-size: 690rpx 248rpx;
	color: #7E4A22;
}
.e-bage{
	border-radius:16rpx 16rpx 16rpx 0rpx;
	background: #FF4900;
	color: #ffffff
}
.e-money-btn{
	background: #7E4A22;
	width: 162rpx;
	height: 58rpx;
}
.func{
	background-color: #FAFAFA;
	border-radius: 8rpx;
}
</style>
